<!DOCTYPE html>
<html>
<head>
    <title>蚂蚁金融云-管理控制台</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <link type="image/png" href="image/favicon.png" rel="shortcut icon"/>
    <link rel="stylesheet" type="text/css" href="vendor/tether/tether.min.css"/>
    <link rel="stylesheet" type="text/css"
          href="vendor/bootstrap/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="style/style.css"/>
</head>
<body class="afc-body">
<div class="afc-container container">
    <header>
        <div class="afc-logo"></div>
    </header>
    <div class="afc-content">
        <div class="afc-table-action text-right">
            <a class="btn btn-primary afc-new-order" href="javascript:void(0);" role="button" data-toggle="modal"
               data-target="#createOrderModal">创建交易</a>
        </div>
        <div class="table-responsive">
            <table class="afc-orders table">
                <thead>
                <tr>
                    <th>流水号</th>
                    <th>时间</th>
                    <th>价格</th>
                    <th>Status</th>
                    <th>From</th>
                    <th>To</th>
                    <th>Action</th>
                </tr>
                </thead>
                <tbody class="afc-orders-body">

                </tbody>
            </table>
            <nav>
                <ul class="pagination justify-content-end">
                    <li class="page-item">
                        <a class="page-link" href="#" aria-label="Previous">
                            <span aria-hidden="true">&laquo;</span>
                            <span class="sr-only">Previous</span>
                        </a>
                    </li>
                    <li class="page-item"><a class="page-link" href="#">1</a></li>
                    <li class="page-item"><a class="page-link" href="#">2</a></li>
                    <li class="page-item"><a class="page-link" href="#">3</a></li>
                    <li class="page-item">
                        <a class="page-link" href="#" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span>
                            <span class="sr-only">Next</span>
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
    </div>
    <div>
        <div class="modal fade" id="createOrderModal">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">创建交易</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="asf-form-validation-msg alert alert-danger hide" role="alert">

                        </div>
                        <form class="afc-create-order-form">
                            <div class="form-group row">
                                <label for="from" class="col-2 col-form-label">From</label>
                                <div class="col-10">
                                    <select class="form-control" id="from" name="buyerId" required="required">
                                        <option>100001</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="from" class="col-2 col-form-label">To</label>
                                <div class="col-10">
                                    <select class="form-control" id="to" name="sellerId" required="required">
                                        <option>100099</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="payAmount" class="col-2 col-form-label">价格</label>
                                <div class="col-10">
                                    <input class="form-control" required="required" type="number" id="payAmount"
                                           name="payAmount"/>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                        <button type="button" class="afc-create-order-btn btn btn-primary">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!--    <footer class="afc-copyright text-center">
        蚂蚁金融云版权所有 © 2017
    </footer>-->
</div>

<script type="text/javascript"
        src="vendor/tether/tether.min.js"></script>
<script type="text/javascript"
        src="vendor/jquery/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="vendor/bootstrap/bootstrap.min.js"></script>

<script type="text/javascript" src="js/url.js"></script>
<script type="text/javascript" src="js/api.js"></script>
<script type="text/javascript" src="js/main.js"></script>

</body>
</html>